import React, { useState ,useRef} from 'react'
import { demoConetx } from "../utils/context"
import { useContext } from "react" // useConetx是用来处理上下文对象的
function Appson() {
    let [val, setVal] = useState("")
    let [val1, setVal1] = useState("")
    let inputRef = useRef(null)
    let data = useContext(demoConetx)
    console.log(data);
    let changeVal = (e) => {
        console.log(e.target.value);
        setVal(e.target.value)
    }
    // let fn =()=>{
    //     console.log(inputVal.current.value);
    // }
    let fn1 = ()=>{
        console.log(inputRef.current);
       console.log(inputRef.current.value); 
    }
    return (
        <div>appson
            {/* 在react中使用受控组件或者非受控组件来获取表单元素的值 */}
            <input type="text" value={val} onChange={changeVal} />
            <input type="text" defaultValue={val1} />
            <input ref={inputRef}></input>
            <button onClick={fn1}>点击</button>

        </div>
    )
}

export default Appson